<!-- Include the CanvasXpress library in your HTML file -->
<link rel="stylesheet" href="https://www.canvasxpress.org/dist/canvasXpress.css" type="text/css"/>
<script src="https://www.canvasxpress.org/canvasXpress.min.js"></script>


<!-- Create a canvas element for the chart with the desired dimensions -->
<div>
  <canvas id="canvasId" width="600" height="600"</canvas>
</div>


<!-- Create a script to initialize the chart -->
<script>

  <!-- Create the data for the graph -->
  var data = {
     "y" : {
        "data" : [
          [76.3,167.6],
          [58.6,163.8],
          [59.5,160],
          [60.3,164.5],
          [53.9,162.6],
          [78.8,176],
          [74.9,172.1],
          [62.3,170.2],
          [89.6,178],
          [59.8,167],
          [47.3,152.4],
          [102.5,177.8]
        ],
        "smps" : ["Weight","Height"],
        "vars" : ["Jax","Finley","Eloise","Elena","Ember","Owen","Ezra","Knox","Mateo","Charlie","Rosalie","Marcus"]
     },
     "z" : {
        "Age" : [35,31,42,23,37,22,25,30,24,20,25,28],
        "Chest" : [104.3,85.4,86.7,86.8,72.6,100,100,101.2,108.8,85.9,78,116.7],
        "Exercise" : ["Moderate","Intense","Moderate","Intense","Low","Intense","Moderate","Moderate","Moderate","Low","Intense","Intense"],
        "Gender" : ["Male","Female","Female","Female","Female","Male","Male","Male","Male","Female","Female","Male"],
        "Hair" : ["Blond","Black","Black","Blond","Brown","Brown","Red","Blond","Blond","Brown","Brown","Red"],
        "Hip" : [100.4,94,100,93.7,90.2,98,98.4,87.6,106,94.1,87,107.9],
        "Waist" : [94.3,68.3,74.7,69.8,58,92,79.7,71.8,89.5,69.1,60.4,113.2]
     }
  }
  
  
  <-- Create the configuration for the graph -->
  var config = {
     "graphType":"Scatter2D",
     "histogramBins":"false",
     "showTransition":"false",
     "theme":"CanvasXpress"
  }
  

  <!-- Call the CanvasXpress function to create the graph -->
  var cX = new CanvasXpress("canvasId", data, config);


  
  <-- Functions after rendering graph -->
  cX.createDOE();
  
</script>